

<template>
  <div>
      <!-- 头部标签 -->
 <header>
     <van-nav-bar
  title="客户列表信息"
  left-arrow
  @click-left="onClickLeft"
   @click-right="onClickRight"
  right-text="新增"
/>
 </header>
 <!-- 搜索框 -->
 <div class="search">
     <van-search
  v-model="value"
  show-action
   shape="round"
  placeholder="关键词查询"
  @search="onSearch"
>
  <template #action>
    <div @click="onSearch">搜索</div>
  </template>
</van-search>
 </div>
<div v-for='(item,index) in records' :key='index' >
    <!-- 卡片 -->
 <van-card :style="{paddingTop: '.1rem' }" @click="$router.push(`/custmer/${item.id}`)"
 
>
 <template #tags >
     <p> 客户名称  <i>{{item.custName}}</i></p>
      <p> 联系方式 <i>{{item.telephone}}</i></p>
     <p> 公司名称  <i>{{item.company}}</i></p>
     <p> 职务  <i>{{item.position}}</i></p>
  </template>
</van-card>
<!-- 按钮 -->
<van-row type="flex" justify="center" :style="{paddingTop: '.1rem' }">
  <van-col span="8"></van-col>
  <van-col span="8"><van-button  @click="addvisit" color="#003399" round >新增拜访</van-button>
  </van-col>
  <van-col span="8"><van-button @click='$router.push("/cust")' color="#003399" round >拜访记录</van-button>
  </van-col>
</van-row>
</div>
  </div>
</template>

<script>
import {cust} from '../../request/api'

export default {
  data(){
    return{
          value: '',
            active: 2,
            records:[]
    }
  },
  created(){
       cust({
     
        current:'1',
        size:'10'
    }).then(res=>{
       
        this.records=res.data.records
         console.log(this.records);
    })
  },
   methods: {
    onClickLeft() {
      this.$router.push('/login')
    },
      onSearch(val) {
      Toast(val);
    },
    onClickRight() {
      this.$router.push('/custDetail')
    },
     onClick(name) {
       this.$router.push(name)
    },
     addvisit(){
      this.$router.push('/addvisit')
    },
   
  },
}
</script>

<style lang='less' scoped>
*{
    font-size: .18rem!important;
}
header{
    background: #003399;
    .van-nav-bar{background:#003399;
font-size: .2rem;
padding:3% 0 0;
.van-nav-bar__title,.van-nav-bar__text{
    color: white;
    font-size: .2rem;
}
.van-icon{
    font-size: .2rem;
    color: white;
}
     }
    
}
.search{
   .van-search__action{
        color:#003399;
    }
}
.van-card{
  background: white;
}
</style>